<script setup lang="tsx">
import { reactive } from 'vue'
import { getPersonnelListApi } from '@/api/search/index'
import { useTablePage1, type OptionsItem } from '@/hooks/web'
const props = defineProps({
  id: { type: String, required: true },
  orgName: { type: String, required: true }
})
const { table, page, getRecords } = useTablePage1(getPersonnelListApi, {ruleForm:{
  orgName:props.orgName
}},props.id)


const ruleTable = reactive({
  columns: [
    { label: '姓名', prop: 'name' },
    { label: '职位', prop: 'position' },
    { label: '邮箱', prop: 'email' },
    { label: '收录时间', prop: 'time' },
    { label: '简介', prop: 'desc' },
    { label: '来源', prop: 'source' },
    {
      label: '操作',
      width: 200,
      render: () => <span class="click">详情</span>
    }
  ]
})

</script>
<template>
  <!-- 邮箱列表 -->
  <jmp-table
    :data="table.records"
    :columns="ruleTable.columns"
    :loading="table.loading"
  />
  <!-- 分页 -->
  <jmp-pagination
    v-model:page="page.pageNum"
    v-model:limit="page.pageSize"
    v-model:total="page.total"
  />
</template>
<style scoped lang="scss">
.flex {
  display: flex;
}
.search {
  margin-bottom: 1.25rem;
  .input {
    flex: 1;
    margin-right: 0.625rem;
  }
}
</style>
